<script setup lang="ts">
import {ref} from 'vue';

let images = ref({
  list: [
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg',
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg',
    'https://fastly.jsdelivr.net/npm/@vant/assets/apple-1.jpeg',
  ]
});

</script>

<template>
  <van-nav-bar
      title="Vant4-VUE3"/>
  <van-swipe :autoplay="3000" lazy-render :height="200">
    <van-swipe-item v-for="(image,index) in images.list" :key="index">
      <van-image :src="image">
        <template v-slot:loading>
          <van-loading type="spinner" size="20"/>
        </template>
      </van-image>
    </van-swipe-item>
  </van-swipe>
</template>

<style scoped lang="less">

</style>
